import React, { useState } from 'react';
import './my.css'
import { useNavigate } from 'react-router-dom';
export default function My() {
  const [show, setShow] = useState(true)
  const navigate = useNavigate()
  function routers(type){
    if(show){
      navigate(type)
    }else{
      alert('没登录')
    }
  }
  return (
    <div className='my'>
      <div className='my-div'>
        {
          show ?
            <div className='my-log'>
              <div className='my-one'><img src='../微信图片_20230616204424.png' className='my-img'/></div>
              <div className='my-deng-one'>
                <div className='my-deng-diva'>用户12345</div>
                <div className='my-deng-divb'>编辑用户资料</div>
              </div>
            </div> :
            <div className='my-log'>
              <div className='my-one'><i className="iconfont icon-04"></i></div>
              <div className='my-deng'>登录/注册</div>
            </div>
        }

        <div className='my-daka'>
          <i className="iconfont icon-daka"></i>
        </div>
        <div className='my-biao'>
          <div className='my-i'><i className="iconfont icon-huangguan"></i></div>
          <div className='my-du'>开通易阅读会员  免费畅享阅读</div>
          <div className='my-buttons'>
            <button className='my-button'>立即开通<i className="iconfont icon-xiangyoujiantou"></i></button>
          </div>
        </div>
      </div>
      <div className='my-zhong'>
        <div className='my-fen'>
          <div className='my-li'>
            <div className='my-zi'>10</div>
            <div className='my-zi'>阅读币</div>
          </div>
          <div className='my-li'>
            <div className='my-zi'>3</div>
            <div className='my-zi'>笔记</div>
          </div>
          <div className='my-li'>
            <div className='my-zi'>1</div>
            <div className='my-zi'>书单</div>
          </div>
          <div className='my-li'>
            <div className='my-zi'>29h</div>
            <div className='my-zi'>阅历</div>
          </div>
        </div>
      </div>
      <div className='my-btn'>
        <div className='my-btn-yue'>
          <div className='btn-one'><i className='iconfont icon-liebiao' /> </div>
          <div className='btn-two' onClick={()=>{routers('/preference')}}>阅读偏好</div>
          <div className='btn-three'><i className="iconfont icon-xiangyoujiantou"></i></div>
        </div>
        <div className='my-btn-yue'>
          <div className='btn-one'><i className='iconfont icon-shizhong' /> </div>
          <div className='btn-two' onClick={()=>{routers('/footprint')}}>我的足迹</div>
          <div className='btn-three'><i className="iconfont icon-xiangyoujiantou"></i></div>
        </div>
        <div className='my-btn-yue'>
          <div className='btn-one'><i className='iconfont icon-xiaoxi' /> </div>
          <div className='btn-two' onClick={()=>{routers('/message')}}>消息通知</div>
          <div className='btn-three'><i className="iconfont icon-xiangyoujiantou"></i></div>
        </div>
        <div className='my-btn-yue'>
          <div className='btn-one'><i className='iconfont icon-xitong' /> </div>
          <div className='btn-two' onClick={()=>{routers('/SystemSet')}}>系统设置</div>
          <div className='btn-three'><i className="iconfont icon-xiangyoujiantou"></i></div>
        </div>
        <div className='my-btn-yue'>
          <div className='btn-one'><i className='iconfont icon-shangchuan' /> </div>
          <div className='btn-two' onClick={()=>{routers('/Feedback')}}>意见反馈</div>
          <div className='btn-three'><i className="iconfont icon-xiangyoujiantou"></i></div>
        </div>
      </div>
    </div>
  );
}
